<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="js/reg.js"></script>
  <title> HTML Demo </title>
  <style type="text/css">	
  #list li{list-style:none; margin-bottom:20px;}
    input{
       border-radius:6px;
       border:1px solid #909090;
       -webkit-transition: box-shadow 0.30s ease-in-out;   //只让box-shadow属性做过渡效果！
       -moz-transition:  box-shadow 0.30s ease-in-out;      //firefox
    }

   input :focus{
     outline:none;
     border:#87C6F9 1px solid;
     box-shadow: 0 0 8px rgba(103, 166, 217, 1);
   }
  </style>  
<script type="text/javascript">
	var regSubmit = function()
	{
		//TODO 判断是否可以提交
		document.regForm.action = "reg.do";
		document.regForm.submit();
		return true;
	}
    </script>
 </head>
 <body>
<h1>注册页面</h1>
<form id="regForm" name="regForm" method="post" onsubmit="return regSubmit()">
	<fieldset>
		<ul id="list">
			<li>
				<label for="username">用户名</label>
				<input id="username" name="username" placeholder="请填写用户名" required="required" autofocus="" type="text" />
				<span id="dvUsername"  style="color:green; font-size:10px">请输入6~10长度用户名</span>
			</li>
			<li>
				<label for="upwd">密&nbsp;&nbsp;码</label>
				<input id="upwd" name="upwd" placeholder="请填写密码" required="required" type="password"/>
				<span id="dvPwd1"  style="color:green; font-size:10px">请输入6~12位数字或字母</span>
			</li>
			<li>
				<label for="reupwd">确认密码</label>
				<input id="reupwd" name="reupwd" placeholder="确认密码" required="required" type="password" />
				<span id="dvPwd" style="color:green; font-size:10px"></span>
			</li>
			<li>
				<label for="company">公司名</label>
				<input id="company" name="company" placeholder="请填写公司名" required="required" autofocus="" type="text" />
			</li>
			<li>
				<label for="uemail">邮&nbsp;&nbsp;件</label>
				<input id="uemail" name="uemail" placeholder="example@domain.com" required="required"  type="email" />
			</li>	
			<li>地&nbsp;&nbsp;区
			<select id="province" name="province" onChange="getcity()">
    				<option value="-1">选择省份</option>
    				<option value="北京市">北京市 </option>
                    <option value="广东省">广东省 </option>
                 	<option value="上海市">上海市 </option>
					<option value="天津市">天津市 </option>
					<option value="重庆市">重庆市 </option>
                    <option>辽宁省</option>
                    <option>江苏省</option>
                    <option>湖北省</option>
                    <option>四川省</option>
                    <option>陕西省</option>
                    <option>河北省</option>
                    <option>山西省</option>
                    <option>河南省</option>
                    <option>吉林省</option>
                    <option>黑龙江</option>
                    <option>内蒙古</option>
                    <option>山东省</option>
                    <option>安徽省</option>
                    <option>浙江省</option>
                    <option>福建省</option>
                    <option>湖南省</option>
                    <option>广西省</option>
                    <option>江西省</option>
                    <option>贵州省</option>
                    <option>云南省</option>
                    <option>西藏</option>
                    <option>海南省</option>
                    <option>甘肃省</option>
                    <option>宁夏</option>
                    <option>青海省</option>
                    <option>新疆</option>
                    <option>香港</option>
                    <option>澳门</option>
                    <option>台湾</option>
                    <option>海外</option>
                    <option>其他</option>
			   </select>省
			  <select id="city" name="city">
				<option value="-1">市</option>
			  </select>市		
		</li>
		<li>
		<li>
			<label for="phone">电&nbsp;&nbsp;话</label>
			<input id="phone" name="phone" placeholder="请输入您的电话" required="required" autofocus="" type="text" />
			<span id="dvPhone" style=" color:green; font-size:10px "></span>
		</li>
		</li>	
	</ul>	
</fieldset>
	<div>
		<button type="submit">注册用户</button>
	</div>
</form>
 </body>
</html>
